{extend name="default/base/base_joinin" /}
{block name="joinin_main"}
<link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/common.css">
<script type="text/javascript"
        src="{$Think.HTTP_TYPE}api.map.baidu.com/api?v=2.0&ak=22bb7221fc279a484895afcc6a0bb33a"></script>
<script>
    var local;
    var map;
    var lst_name = '';

    function change_map() {
        if ($("#area_ select:eq(0)").length > 0 && $("#area_ select:eq(0) option:selected").val() != '') {
            var name = $("#area_ select:eq(0) option:selected").text();
        }
        if ($("#area_ select:eq(1)").length > 0 && $("#area_ select:eq(1) option:selected").val() != '') {
            var name = $("#area_ select:eq(1) option:selected").text();
        }
        if ($("#area_ select:eq(2)").length > 0 && $("#area_ select:eq(2) option:selected").val() != '') {
            var name = $("#area_ select:eq(2) option:selected").text();
        }
        if (name != '' && lst_name != name) {
            lst_name = name;
            map.setCurrentCity(name);
            map.centerAndZoom(name, 16);
            map.clearOverlays();
            local.search(name);
        }

    }

    $(function () {
        map = new BMap.Map("allmap");
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                var lng = r.point.lng;
                var lat = r.point.lat;
                var point = new BMap.Point(lng, lat);
                map.centerAndZoom(point, 16);
                map.addControl(new BMap.NavigationControl());
                map.enableScrollWheelZoom();
                var marker = new BMap.Marker(point);  // 创建标注
                map.addOverlay(marker);              // 将标注添加到地图中
                marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
                document.getElementById("longitude").value = lng;
                document.getElementById("latitude").value = lat;

            } else {
                layer.msg('failed' + this.getStatus());
            }
        }, {enableHighAccuracy: true})

        var options = {
            onSearchComplete: function (results) {
                // 判断状态是否正确
                if (local.getStatus() == BMAP_STATUS_SUCCESS) {
                    if (results.getCurrentNumPois() > 0) {

                        map.clearOverlays();  //清除标注  或者可以把market 放入数组
                        var point = new BMap.Point(results.getPoi(0).point.lng, results.getPoi(0).point.lat);
                        var marker = new BMap.Marker(point);
                        map.centerAndZoom(point, 16);
                        map.addOverlay(marker);
                        marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画

                        document.getElementById("longitude").value = results.getPoi(0).point.lng;
                        document.getElementById("latitude").value = results.getPoi(0).point.lat;

                    }
                }
            }
        };
        local = new BMap.LocalSearch(map, options);
        map.addEventListener("click", function (e) {
//                    alert(e.point.lng + ", " + e.point.lat);
            map.clearOverlays();  //清除标注  或者可以把market 放入数组
            var point = new BMap.Point(e.point.lng, e.point.lat);
            var marker = new BMap.Marker(point);
            map.addOverlay(marker);
            marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画

            document.getElementById("longitude").value = e.point.lng;
            document.getElementById("latitude").value = e.point.lat;
        });
    })
</script>
<div class="breadcrumb"><span class="iconfont">&#xe6ff;</span><span><a href="">{$Think.lang.homepage}</a></span> <span
        class="arrow">></span> <span>{$Think.lang.merchant_entry_application}</span></div>
<div class="main">
    <div class="sidebar">
        <div class="title">
            <h3>{$Think.lang.merchant_entry_application}</h3>
        </div>
        <div class="content">
            <dl>
                <dt class="{if $sub_step == 'step0'}current{/if}"><i class="hide"></i>{$Think.lang.enter_agreement}</dt>
            </dl>
            <dl show_id="0">
                <dt onclick="show_list('0');" style="cursor: pointer;"><i class="show"></i>{$Think.lang.submit_application}
                </dt>
                <dd>
                    <ul style='margin-left:26px;'>
                        <li><i></i>{$Think.lang.store_qualification_information}</li>
                        <li><i></i>{$Think.lang.financial_qualification_information}</li>
                        <li><i></i>{$Think.lang.store_operation_information}</li>
                    </ul>
                </dd>
            </dl>
            <dl>
                <dt class="{if $sub_step == 'pay'}current{/if}"><i class="hide"></i>{$Think.lang.contract_signing_payment}
                </dt>
            </dl>
            <dl>
                <dt><i class="hide"></i>{$Think.lang.store_opening}</dt>
            </dl>
        </div>
    </div>
    <div class="right-layout">
        <div class="joinin-step">
            <ul>
                <li class="step1 {if $sub_step >= 'step0'}current{/if} {if $sub_step == 'pay'}current{/if}"><span>{$Think.lang.enter_agreement}</span>
                </li>
                <li class="{if $sub_step >= 'step1'}current{/if} {if $sub_step == 'pay'}current{/if}"><span>{$Think.lang.store_qualification_information}</span>
                </li>
                <li class="{if $sub_step >= 'step2'}current{/if} {if $sub_step == 'pay'}current{/if}"><span>{$Think.lang.financial_qualification_information}</span>
                </li>
                <li class="{if $sub_step >= 'step3'}current{/if} {if $sub_step == 'pay'}current{/if}"><span>{$Think.lang.store_operation_information}</span>
                </li>
                <li class="{if $sub_step >= 'step4'}current{/if} {if $sub_step == 'pay'}current{/if}"><span>{$Think.lang.contract_signing_payment}</span>
                </li>
                <li class="step6"><span>{$Think.lang.store_opening}</span></li>
            </ul>
        </div>
        <div class="joinin-concrete">
            <!-- 公司信息 -->

            <div id="apply_company_info" class="apply-company-info">
                <div class="alert">
                    <h4>{$Think.lang.matters_needing_attention}：</h4>
                    {$Think.lang.upload_information1}
                </div>
                <form id="form_company_info" action="{:url('Sellerjoininc2c/step2')}" method="post"
                      enctype="multipart/form-data">
                    <table border="0" cellpadding="0" cellspacing="0" class="all">
                        <thead>
                        <tr>
                            <th colspan="2">{$Think.lang.store_contact_information}</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <th><i>*</i>{$Think.lang.store_name}：</th>
                            <td><input name="company_name" id="company_name" type="text" class="w200"
                                       value="{$info.company_name|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.location}：</th>
                            {if isset($info) && !empty($info.company_address)}
                            <td id="area_" style="display: none">
                                <input type="hidden" value="" name="company_address" id="company_address">
                                <input type="hidden" value="" name="province_id" id="_area_1">
                                <input type="hidden" value="" name="city_id" id="_area_2">
                                <input type="hidden" value="" name="district_id" id="_area_3">
                                <span></span></td>
                            <td id="remove_area">
                                {$info.company_address}
                                <input type="hidden" value="{$info.company_address}" name="company_address"
                                       id="company_address">
                                <input type="button" value="编辑" id="edit_area">
                            </td>
                            {else}
                            <td id="area_">
                                <input type="hidden" value="" name="company_address" id="company_address">
                                <input type="hidden" value="" name="province_id" id="_area_1">
                                <input type="hidden" value="" name="city_id" id="_area_2">
                                <input type="hidden" value="" name="district_id" id="_area_3">
                                <span></span></td>
                            {/if}
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.detailed_address}：</th>
                            <td><input name="company_address_detail" type="text" class="w200"
                                       value="{$info.company_address_detail|default=''}">
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.legal_person}：</th>
                            <td><input name="legal_person" type="text" class="w200"
                                       value="{$info.legal_person|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.legal_person_phone}：</th>
                            <td><input name="legal_person_phone" type="text" class="w200"
                                       value="{$info.legal_person_phone|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.contact_name}：</th>
                            <td><input name="contacts_name" type="text" class="w200"
                                       value="{$info.contacts_name|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th>联系人座机：</th>
                            <td><input name="contacts_phone" type="text" class="w200"
                                       value="{$info.contacts_phone|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.contact_legal_phone}：</th>
                            <td><input name="contact_legal_phone" type="text" class="w200"
                                       value="{$info.contact_legal_phone|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th>{$Think.lang.contact_qq}：</th>
                            <td><input name="contact_qq" type="text" class="w200"
                                       value="{$info.contact_qq|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.email_address}：</th>
                            <td><input name="contacts_email" type="text" class="w200" id="contacts_email"
                                       value="{$info.contacts_email|default=''}"/>
                                <span></span></td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr>
                            <td colspan="20">&nbsp;</td>
                        </tr>
                        </tfoot>
                    </table>
                    <table border="0" cellpadding="0" cellspacing="0" class="all">
                        <thead>
                        <tr>
                            <th colspan="20">{$Think.lang.business_license_information}</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <th><i>*</i>社会统一信用代码：</th>
                            <td><input name="business_licence_number" type="text" class="w200"
                                       value="{$info.business_licence_number|default=''}"/>
                                <span></span></td>
                        </tr>


                        <tr>
                            <th><i>*</i>{$Think.lang.place_business_license}：</th>
                            {if isset($info) && !empty($info.business_licence_address)}
                            <td id='address' style="display: none;"><input id="business_licence_address"
                                                                           value="{$info.business_licence_address}"
                                                                           name="business_licence_address"
                                                                           type="hidden"/></td>
                            <td id="remove_address">{$info.business_licence_address}

                                <input type="button" value="编辑" id="edit_address">
                            </td>
                            {else}
                            <td><input id="business_licence_address" name="business_licence_address" type="hidden"/>
                                <span></span></td>
                            {/if}
                        </tr>

                        <tr>
                            <th><i>*</i>{$Think.lang.validity_business_license}：</th>
                            <td><input id="business_licence_start" name="business_licence_start" type="text" class="w90"
                                       value="{$info.business_licence_start|default=''}"/>
                                <span></span>-
                                <input id="business_licence_end" name="business_licence_end" type="text" class="w90"
                                       value="{$info.business_licence_end|default=''}"/>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th>{$Think.lang.legal_scope_business}：</th>
                            <td><textarea name="business_sphere" id="legal_scope_business" rows="3" class="w200">{$info.business_sphere|default=''}</textarea>
                                <span></span></td>
                        </tr>
                        <tr>
                            <th><i>*</i>{$Think.lang.business_license}{$Think.lang.electronic_version}：</th>
                            <td><input type="file" class="w200" id="imgs"
                                       data-action="{:url('Sellerjoininc2c/ajax_imgs')}"/>
                                <input type="hidden" name="business_licence_number_electronic" id="file"
                                       value="{$info.business_licence_number_electronic|default=''}"/>
                                <span class="block">{$Think.lang.upload_information2}注意：请上传后缀名为：jpeg,jpg,png</span></td>
                        </tr>

                        </tbody>
                        <tfoot>
                        <tr>
                            <td colspan="20">&nbsp;</td>
                        </tr>
                        </tfoot>
                    </table>
                </form>
                <div class="bottom"><a id="btn_apply_company_next" href="javascript:;" class="btn">{$Think.lang.upload_information3}</a>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">

    $(document).ready(function () {

        //轮播图视频上传
        $(document).on('change', '#imgs', function () {
            var files = document.getElementById('imgs').files[0];
            var formData = new FormData();
            var obj = $(this);
            formData.append('file', files);
            var url = $(this).attr('data-action');
            layer.msg('正在上传');
            $.ajax({
                //请求方式
                type: "POST",
                //请求地址
                url: url,
                data: formData,
                processData: false, //用于对data参数进行序列化处理，这里必须false；如果是true，就会将FormData转换为String类型
                contentType: false,  //一些文件上传http协议的关系，自行百度，如果上传的有文件，那么只能设置为false
                //请求成功
                success: function (result) {
                //    alert(result);return false;
                    if (result.err == 0) {
                        $('#show_imgs').remove();
                        layer.msg('上传成功');
                        $("#file").val(result.data);
                    } else {
                        obj.val('');
                        layer.msg('文件信息错误,请重新上传');
                        return false;
                    }

                },
                //请求失败，包含具体的错误信息
                error: function (e) {
                    console.log(e.status);
                    console.log(e.responseText);
                }
            });

        });


        //编辑所在地
        $('#edit_area').click(function () {
            $("#area_").show();
            $("#remove_area").remove();
        });

        //编辑营业执照所在地
        $('#edit_address').click(function () {
            $("#address").show();
            $("#remove_address").remove();
        });


        $('#company_address').ds_region();
        $('#business_licence_address').ds_region();

        $('#business_licence_start').datepicker({dateFormat: 'yy-mm-dd',   changeMonth: true,
                 changeYear: true});
        $('#business_licence_end').datepicker({dateFormat: 'yy-mm-dd',   changeMonth: true,
                 changeYear: true});

        $('#btn_apply_agreement_next').on('click', function () {
            if ($('#input_apply_agreement').prop('checked')) {
                $('#apply_agreement').hide();
                $('#apply_company_info').show();
            } else {
                layer.msg('{$Think.lang.read_agree_agreement}');
            }
        });

        $('#form_company_info').validate({
            errorPlacement: function (error, element) {
                element.nextAll('span').first().after(error);
            },
            rules: {
                company_address: {
                    required: true,
                    maxlength: 50
                },
                company_address_detail: {
                    required: true,
                    maxlength: 50
                },

                company_registered_capital: {
                    required: true,
                    digits: true
                },
                contacts_name: {
                    required: true,
                    maxlength: 20
                },
                legal_person: {
                    required: true,
                    maxlength: 20
                },
                contact_qq: {
                    maxlength: 12,
                    minlength: 6,
                },
                contact_legal_phone: {
                    required: true,
                    maxlength: 11,
                    minlength: 11,
                },
                legal_person_phone: {
                    required: true,
                    maxlength: 11,
                    minlength: 11,
                },
                contacts_email: {
                    required: true,
                    email: true
                },
                business_licence_number: {
                    required: true,
                    maxlength: 18,
                    minlength: 18,
                },
                business_licence_address: {
                    required: true,
                    maxlength: 50
                },
                business_licence_start: {
                    required: true
                },
                business_licence_end: {
                    required: true
                },

            },
            messages: {
                company_name: {
                    required: '{$Think.lang.enter_company_name}',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}"),
                    remote: '企业名称不可以重复',
                },
                company_address: {
                    required: '{$Think.lang.select_area_address}',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}")
                },
                company_address_detail: {
                    required: '{$Think.lang.enter_company_details}',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}")
                },
                company_registered_capital: {
                    required: '{$Think.lang.enter_registered_capital}',
                    digits: '{$Think.lang.must_numeric}'
                },
                contacts_name: {
                    required: '请输入联系人姓名',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}")
                },
                legal_person: {
                    required: '{$Think.lang.enter_faren_name}',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}")
                },
                contacts_phone: {
                    required: '{$Think.lang.enter_contact_phone}',
                    maxlength: "{$Think.lang.fill_your_phone_number_correctly}",
                    minlength: "{$Think.lang.fill_your_phone_number_correctly}",
                },
                contact_qq: {
                    maxlength: "{$Think.lang.fill_your_qq_number_correctly}",
                    minlength: "{$Think.lang.fill_your_qq_number_correctly}",
                },
                contact_legal_phone: {
                    required: '{$Think.lang.enter_contact_phone_faren}',
                    maxlength: "{$Think.lang.fill_your_phone_number_correctly}",
                    minlength: "{$Think.lang.fill_your_phone_number_correctly}",
                },
                legal_person_phone: {
                    required: '{$Think.lang.enter_faren_phone}',
                    maxlength: "{$Think.lang.fill_your_phone_number_correctly}",
                    minlength: "{$Think.lang.fill_your_phone_number_correctly}",
                },
                contacts_email: {
                    required: '{$Think.lang.enter_common_email_address}',
                    email: '{$Think.lang.fill_correct_email_address}'
                },
                business_licence_number: {
                    required: '{$Think.lang.enter_business_license_number}',
                    maxlength: jQuery.validator.format("最多18个字符"),
                    minlength: jQuery.validator.format("最少18个字符"),
                },
                business_licence_address: {
                    required: '{$Think.lang.select_location_business_license}',
                    maxlength: jQuery.validator.format("{$Think.lang.most_words}")
                },
                business_licence_start: {
                    required: '{$Think.lang.select_effective_date}'
                },
                business_licence_end: {
                    required: '{$Think.lang.select_end_date}'
                },

            }
        });

        $('#btn_apply_company_next').on('click', function () {
            if ($('#form_company_info').valid()) {
                var files = $("#file").val();
                if (files == '') {
                    layer.msg('请上传营业执照电子版后再提交');
                    return false;
                }

                $("#form_company_info").submit();
            }

        });
    });
    $((function ($) {

        $.datepicker.regional['zh-CN'] = {

            clearText: '清除',

            clearStatus: '清除已选日期',

            closeText: '关闭',

            closeStatus: '不改变当前选择',

            prevText: '<上月',

            prevStatus: '显示上月',

            prevBigText: '<<',

            prevBigStatus: '显示上一年',

            nextText: '下月>',

            nextStatus: '显示下月',

            nextBigText: '>>',

            nextBigStatus: '显示下一年',

            currentText: '今天',

            currentStatus: '显示本月',

            monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],

            monthNamesShort: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二'],

            monthStatus: '选择月份',

            yearStatus: '选择年份',

            weekHeader: '周',

            weekStatus: '年内周次',

            dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],

            dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],

            dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],

            dayStatus: '设置 DD 为一周起始',

            dateStatus: '选择 m月 d日, DD',

            dateFormat: 'yy-mm-dd',

            firstDay: 1,

            initStatus: '请选择日期',

            showMonthAfterYear: true,//是否把月放在年的后面

            yearSuffix: '年', //年的后缀

            isRTL: false

        };

        $.datepicker.setDefaults($.datepicker.regional['zh-CN']);

    })(jQuery));
</script>


{/block}